<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1.0"
    />
    <title>Document</title>
  </head>
  <body>
    <div id="username"></div>
    <div id="userage"></div>
    <div id="app">{{count}}</div>
    <!-- vue 团队的vue -->
    <!-- <script src="../node_modules/vue/dist/vue.js"></script> -->
    <!-- 模拟的 -->
    <script src="../dist/vue.js"></script>
    <script>
      const vm = new Vue({
        el: '#app', // 选择器，可以在对应的元素内使用vue
        data() {
          console.log(this)
          return {
            count: 10
          }
        },
        computed: {}
      })
      // console.log(vm.$options)

      const obj = {
        name: '张三',
        age: 19
      }

      username.innerHTML = obj.name
      userage.innerHTML = obj.age

      // console.log(Object.getOwnPropertyDescriptor(obj, 'name'))
      Object.defineProperty(obj, 'name', {
        value: '李四',
        configurable: false,
        enumerable: false,
        writable: false
      })
      delete obj.name
      for (let key in obj) {
        console.log(key)
      }

      obj.name = '王麻子'
      console.log(obj)
    </script>
  </body>
</html>
